<template>
	<view class="container">
		<z-paging ref="paging" v-model="taskLists" @query="queryList" empty-view-img="../../static/img/nullData.png"
			empty-view-text="暂无数据">
			<!-- 热门 -->
			<view class="hot_project">
				<!-- 标题 -->
				<title-component titleName="热门任务" :isShowMore="false" :isShowBtn="false"></title-component>
				<!-- 滑动区域 -->
				<u-swiper :list="swiperList" previousMargin="30" nextMargin="30" circular :autoplay="false" radius="5"
					bgColor="#ffffff">
				</u-swiper>
			</view>
			<!-- 标题 -->
			<u-tabs :list="tablist" @click="changeTab" :inactiveStyle="{color: '#999'}"
				:activeStyle="{color: 'var(--echo-main-color)'}" lineColor="var(--echo-main-color)"></u-tabs>
			<!-- z-paging -->
			<!-- 任务 -->
			<view class="task_area" v-if="tabIndex === 0">
				<task-card v-for="item in taskLists" :key="item.serialNo" :title="item.taskName"
					:description="item.description" :createTime="item.createTime"
					@linkTo="goToTaskDetail(item.serialNo)">
				</task-card>
			</view>
			<!-- 提案 -->
			<view class="proposal_area" v-if="tabIndex === 1">
				<task-card v-for="item in taskLists" :key="item.serialNo" :title="item.name"
					:description="item.description" :createTime="item.createTime"
					@linkTo="goToProposalDetail(item.serialNo)" toType="proposal">
				</task-card>
			</view>
			<!-- 选举 -->
			<view class="elect_area" v-if="tabIndex === 2">
				<task-card v-for="item in taskLists" :key="item.serialNo" :title="item.name"
					:description="item.description" :createTime="item.createTime"
					@linkTo="goToElectDetail(item.serialNo)" toType="elect">
				</task-card>
			</view>
			<!-- 评选 -->
			<view class="elect_area" v-if="tabIndex === 3">
				<task-card v-for="item in taskLists" :key="item.serialNo" :title="item.name"
					:description="item.description" :createTime="item.createTime"
					@linkTo="goToElectDetail(item.serialNo)" toType="elect">
				</task-card>
			</view>
		</z-paging>
		<!-- 任务创建按钮 -->
		<view class="create_btn" @tap="goToMyTask">
			<u-icon name="plus" color="#fff" size="20"></u-icon>
		</view>
	</view>
</template>

<script>
	import {
		getTaskPageList,
		getVoteProposalPageList,
		getVoteElectionServicePageList,
		getVoteProposalDetails
	} from '@/config/taskApi.js';

	var wx = require('../../node_modules/jweixin-module/lib/index.js');


	export default {
		data() {
			return { // 分段器
				tablist: [{
						name: '任务',
					}, {
						name: '提案',
					},
					{
						name: '选举',
					},
					{
						name: '评选',
					}
				],
				// 任务列表数据
				taskLists: [],
				swiperList: [
					"../../static/img/lunbo1.png",
					"../../static/img/lunbo2.png",
					"../../static/img/lunbo3.png"
				],
				token: '',
				// 控制tab切换判断显示
				tabIndex: 0
			};
		},
		// 每次进入页面触发,用于领取任务之后任务列表的刷新
		onShow() {
			// token
			this.token = uni.getStorageSync('token')
		},
		onLoad(){
			// 向后台获取签名参数
			console.log(wx)
			getWechatSign({
					url: window.location.href
				}).then(res => {
			
				wx.config({
					...res.data,
					jsApiList: ["updateAppMessageShareData", "updateTimelineShareData"]
				});
			
				wx.checkJsApi({
					jsApiList: ["updateAppMessageShareData", "updateTimelineShareData"],
					success: function (res) {
						console.log('检查', res)
					}
				});
			
				wx.ready(function(){
					wx.updateAppMessageShareData({
						title: 's11e-DAO',
						desc: 's11e-DAO邀请您来做任务获取s11e-DAO的token激励',
						link: 'http://h5.huoyuanshequ.com/#/pages/task/task',
						imgUrl: 'http://www.huoyuanshequ.com/logo.png',
						success: function () {
							// 设置成功
						console.log("分享成功返回的信息为:", res);
							//this.$Message.message("设置成功!");
						}
					});
					wx.updateTimelineShareData({
						title: 's11e-DAO web3.0的施工队',
						link: 'http://h5.huoyuanshequ.com/#/pages/task/task',
						imgUrl: 'http://www.huoyuanshequ.com/logo.png',
						success: function () {
							// 设置成功
						console.log("分享成功返回的信息为:", res);
							//this.$Message.message("设置成功!");
						}
					})
				});
			})
		},
		onReady(){
			
		},
		methods: {
			// 任务详情
			goToTaskDetail(serialNo) {
				uni.navigateTo({
					url: "/pages/task/taskDetail?serialNo=" + serialNo + '&taskTypeSign=' + 'task'
				})
			},
			// 提案详情
			goToProposalDetail(serialNo) {
				uni.navigateTo({
					url: "/pages/task/taskDetail?serialNo=" + serialNo + '&taskTypeSign=' + 'proposal'
				})
			},
			goToElectDetail(serialNo) {
				uni.navigateTo({
					url: "/pages/task/taskDetail?serialNo=" + serialNo + '&taskTypeSign=' + 'VoteElection'
				})
			},
			// 任务数据列表查询
			queryList(pageNo, pageSize) {
				if (this.tabIndex == '0') {
					// 查询任务列表
					getTaskPageList({
						pageNo,
						pageSize,
						// 已发布
						status: 1,
					}).then((res) => {
						console.log('任务列表', res)
						this.$refs.paging.completeByTotal(res?.data, res?.pagination?.totalSize);
					})
				} else if (this.tabIndex == '1') {
					// 查询提案列表
					getVoteProposalPageList({
						pageNo,
						pageSize,
						// 进行中
						status: 2,
					}).then((res) => {
						console.log('提案列表', res)
						this.$refs.paging.completeByTotal(res?.data, res?.pagination?.totalSize);
					})
				} else if (this.tabIndex == '2') {
					// 查询选举列表
					getVoteElectionServicePageList({
						pageNo,
						pageSize,
						// 进行中
						type: 2,
					}).then((res) => {
						console.log('选举列表', res)
						this.$refs.paging.completeByTotal(res?.data, res?.pagination?.totalSize);
					})
				} else {
					// 查询评选列表
					getVoteElectionServicePageList({
						pageNo,
						pageSize,
						// 进行中
						type: 1,
					}).then((res) => {
						console.log('评选列表', res)
						this.$refs.paging.completeByTotal(res?.data, res?.pagination?.totalSize);
					})
				}

			},
			// 跳到创建任务页面
			goToMyTask() {
				if (!this.token) {
					uni.$u.toast('请先登陆')
					return
				}
				uni.navigateTo({
					url: "/pages/my/myTask"
				})
			},
			changeTab(item) {
				this.tabIndex = item.index
				// 重新加载数据
				this.$refs.paging?.reload()
			}
		}

	}
</script>

<style lang="scss">
	@import url("/static/css/base.css");

	// 创建按钮
	.create_btn {
		position: fixed;
		right: 40rpx;
		bottom: 140rpx;
		display: flex;
		align-items: center;
		justify-content: center;
		width: 70rpx;
		height: 70rpx;
		border-radius: 50%;
		background: $echo-main-color;
	}
</style>
